﻿<%@ Page Title="" Language="C#" MasterPageFile="~/ANMCMaster.Master" AutoEventWireup="true" CodeBehind="PhotoAlbum.aspx.cs" Inherits="AllNations.UI.PhotoAlbum" %>

<asp:Content ID="ANHeaderContent1" runat="server" ContentPlaceHolderID="ANHeaderContent">
</asp:Content>
<asp:Content ID="ANPageHeader1" runat="server" ContentPlaceHolderID="ANPageHeader">
    <style>
        .content{color:#777;}
        p{margin:0 0 20px}
        .cred{margin-top:20px;}
        /* This rule is read by Galleria to define the gallery height: */
        #galleria{height:600px;}
    </style>
    <!-- load jQuery -->
    <script src="/js/jquery-1.6.2.min.js"></script>
    <!-- load Galleria -->
    <script src="/js/galleria/galleria-1.2.6.min.js"></script>
    <script language="javascript">
        function openModalWindow(title, url, width, height) {
            var popup = radopen(null, "Window1");
            popup.SetWidth(width);
            popup.SetHeight(height);
            popup.SetModal(true);
            popup.SetTitle(title);
            popup.SetUrl(url);
            return false;
        }

        function AddPhotoAlbum() {
            // width: 780; height: 585
            return openModalWindow("New photo album", "/UI/PhotoManager.aspx?View=CreateAlbum&HtmlPageId=" + GetCurrentHtmlPageId(), 560, 480);
        }

        function AddPhotoToAlbum() {
            return openModalWindow("Add more photo", "/UI/PhotoManager.aspx?View=AddPhotoToAlbum&HtmlPageId=" + GetCurrentHtmlPageId() + "&PhotoalbumId=" + GetCurrentPhotoalbumId(), 560, 480);
        }

        function OpenAlbumProperties() {
            return openModalWindow("Album properties", "/UI/PhotoManager.aspx?View=AlbumProperties&HtmlPageId=" + GetCurrentHtmlPageId() + "&PhotoalbumId=" + GetCurrentPhotoalbumId(), 560, 280);
        }
    </script>
    <asp:Image ID="Image8" runat="server" ImageUrl="~/Images/worship_main.png" />
</asp:Content>
<asp:Content ID="ANBodyContent1" runat="server" ContentPlaceHolderID="ANBodyContent">
    <div class="leftnav">
        <div style="margin: 11px 0px 25px 0px;"><asp:Image ID="Image6" runat="server" ImageUrl="~/Images/sectionTitleFellowship.png" /></div>
        <telerik:RadMenu ID="radMenuLeftNav" runat="server" EnableEmbeddedSkins="false" 
            Skin="ANMCLeftNav">
            <Items>
                <telerik:RadMenuItem Text="교회소식" Value="Announcements" NavigateUrl="~/Announcements/Main"></telerik:RadMenuItem>
                <telerik:RadMenuItem Text="주보" Value="SundayBulletin" NavigateUrl="~/FileShare/Main"></telerik:RadMenuItem>
                <telerik:RadMenuItem Text="앨범" Value="PhotoAlbum" Selected="true"></telerik:RadMenuItem>
                <telerik:RadMenuItem Text="행사계획" Value="UpcomingEvents" NavigateUrl="~/Fellowship?UpcomingEvents"></telerik:RadMenuItem>
                <telerik:RadMenuItem Text="목장사역" Value="SmallGroups" NavigateUrl="~/Fellowship?SmallGroups"></telerik:RadMenuItem>
            </Items>
        </telerik:RadMenu>
    </div>
    <div class="rightcontentarea">
        <div id="contentBoxHolder">
            <div class="ContentTitleBar">
                <asp:Image ID="Image7" runat="server" ImageUrl="~/Images/titlePhotoalbum.png" />
            </div>
            <article class="node content">
                <asp:Panel ID="panelContent" runat="server">
                    <telerik:RadMultiPage ID="GalleryViews" SelectedIndex="0" runat="server" RenderSelectedPageOnly="true"  Width="100%">
                        <telerik:RadPageView ID="AlbumListView" runat="server">
                            <div id="playlist">
                                <div class="condensed">
                                    <asp:Repeater ID="dlPhotoAlbum" runat="server">
                                        <ItemTemplate>
                                            <div class="<%# GetStyle() %>" style="text-align: center">
                                                <table style="width: 100%"><tr style="vertical-align: middle"><td style="width: 213px; height: 200px; border: 1px solid #ccc">
                                                    <asp:LinkButton runat="server" OnClick="lnkPhotoAlbum_Click" CommandArgument='<%# Eval("PhotoalbumId") %>'>
                                                        <asp:Image ID="imgPhotoAlbumPhoto" runat="server" AlternateText='<%# Eval("TitleTxt") %>' ImageUrl='<%# string.Format("/PhotoHandler.ashx?Size=180&PhotoId={0}", Eval("LatestPhotoId")) %>' style="padding-left: 10px;" />
                                                    </asp:LinkButton>
                                                </td></tr></table>
                                                <asp:LinkButton ID="lnkPhotoAlbum" runat="server" OnClick="lnkPhotoAlbum_Click" CommandArgument='<%# Eval("PhotoalbumId") %>'>
                                                    <asp:Label ID="lblPhotoAlbumTitle" runat="server" Text='<%# string.Format("{0}<br/>({1} Photo{2})", Eval("TitleTxt"), Eval("PhotoCnt"), (int)Eval("PhotoCnt") > 1 ? "s" : "") %>' style="font-size: 9pt;" />
                                                </asp:LinkButton>
                                            </div>
                                            <asp:PlaceHolder ID="pldEndofColumn" runat="server" OnPreRender="pldEndofColumn_PreRender"></asp:PlaceHolder>
                                        </ItemTemplate>
                                    </asp:Repeater>
                                </div>
                            </div>
                        </telerik:RadPageView>
                        <telerik:RadPageView ID="AlbumView" runat="server">
                            <div class="columns" style="margin: 0px;">
                                <div style="margin: 5px 0px;"><asp:Label ID="lblDescription" runat="server" style="font-size: 100%; color: #333;" /></div>
                                <div id="galleria">
                                    <asp:DataList ID="dlPhoto" Width="100%" runat="server" RepeatColumns="4" RepeatDirection="Horizontal">
                                        <ItemStyle VerticalAlign="Top" HorizontalAlign="Center" Width="25%" />
                                        <ItemTemplate>
                                            <div style="border: 1px solid #e0e0e0; height: 130px;">
                                                <asp:HyperLink runat="server" NavigateUrl='<%# string.Format("/PhotoHandler.ashx?Size=1024&PhotoId={0}", Eval("PhotoId")) %>'>
                                                    <img title='<%# Eval("TitleTxt") %>'
                                                        alt='<%# Eval("TitleTxt") %>'
                                                        src='<%# string.Format("/PhotoHandler.ashx?Size=1024&PhotoId={0}", Eval("PhotoId")) %>' />
                                                </asp:HyperLink>
                                            </div>
                                            <asp:Label ID="lblTitle" runat="server" Text='<%# Eval("TitleTxt") %>' />
                                        </ItemTemplate>
                                    </asp:DataList>
                                </div>
                            </div>
                            <script>
                                // Load the classic theme
                                Galleria.loadTheme('/js/galleria/themes/classic/galleria.classic.min.js');

                                // Initialize Galleria
                                $('#galleria').galleria({
                                    autoplay: 5000, // will move forward every 5 seconds
                                    clicknext: true, // will navigate to the next image in the gallery on click
                                    width: 696,
                                    transition: 'fade',
                                    debug: false,
                                    lightbox: true
                                });
                            </script>
                        </telerik:RadPageView>
                        <telerik:RadPageView ID="PhotoView" runat="server">
                            <table cellpadding="0" cellspacing="0" border="0" style="width: 100%; margin: 0px; margin-left: 0px;">
                                <tr style="vertical-align: top">
                                    <td>
                                        <table width="100%">
                                            <tr style="vertical-align: top">
                                                <td style="text-align: center"><asp:LinkButton ID="lnkPreviousPhoto" OnClick="lnkPreviousPhoto_Click" runat="server"><asp:Image ID="Image1" runat="server" ImageUrl="~/Images/btPrevious.gif" ImageAlign="AbsMiddle" /><br />Previous</asp:LinkButton></td>
                                                <td style="width: 100%; vertical-align: top; padding: 0px 15px;">
                                                    <asp:Label ID="lblSelectedPhotoTitle" runat="server" Font-Bold="true" /><br />
                                                    <asp:Label ID="lblSelectedPhotoDesc" runat="server" /></td>
                                                <td style="text-align: center;"><asp:LinkButton ID="lnkNextPhoto" OnClick="lnkNextPhoto_Click" runat="server"><asp:Image ID="Image2" runat="server" ImageUrl="~/Images/btNext.gif" ImageAlign="AbsMiddle" /><br />Next</asp:LinkButton></td>
                                            </tr>
                                        </table></td>
                                </tr>
                                <tr style="vertical-align: top">
                                    <td style="text-align: center; padding: 15px;">
                                        <asp:Image runat="server" ID="imgSelectedPhoto" />
                                    </td>
                                </tr>
                            </table>
                        </telerik:RadPageView>
                    </telerik:RadMultiPage>
                </asp:Panel>
            </article>
        </div>
        <div style="clear: both;"></div>
    </div>
    <div style="clear: both;"></div>
    <telerik:RadWindowManager ID="RadWindowManager1" runat="server">
        <Windows>
            <telerik:RadWindow ID="Window1" runat="server" Behaviors="Close, Move" VisibleStatusbar="False" />
        </Windows>
    </telerik:RadWindowManager>
</asp:Content>

